<template>
	<view class="container">
			
		<view class="land-selection">
			<view class="land-selection-top">
				<text style="font-weight: bold;">选择地块</text>
				<text class="land-num">剩余土2/4</text>
			</view>
			<view class="land-selection-container">
				
			</view>
		</view>
		<view class="land-selection-time">
			<text style="font-weight: bold;">周期服务</text>
			<text style="margin-left:auto;">一年时间(365天)  ></text>
		</view>
		<view  class="land-selection-service">
			<view class="land-selection-service-top">
				<text style="font-weight: bold;">地块服务</text>
				<text class="land-selection-service-privilege">了解特权></text>
			</view>
		</view>
		<view class="land-dateBase">
			<view>
				<text style="font-weight: bold;">土地数据</text>
			</view>
		</view>
		<view class="land-seedList">
			<view>
				<text style="font-weight: bold;">种子列表</text>
			</view>
		</view>
		<view class="land-History">
			<view>
				<text style="font-weight: bold;">历史记录</text>
			</view>
		</view>
	</view>
</template>

<script setup>
import { defineComponent } from 'vue';

const LandSelect = defineComponent({
  name: 'LandSelect'
});

</script>

<style scoped>
	/* 土地选择区域样式 */
	.land-selection {
		margin-top: 10px;
		height: 200px;
		border: 1px solid red;
		background-color: white;
	}
	.land-selection-top{
		display: flex;
	}
	.land-num{
		font-size: 12px;
		line-height:20px;
		margin-left: auto;
	}
	.land-selection-time{
		height: 40px;
		width: 100%;
		margin-top: 8px;
		border: 1px solid red;
		background-color: white;
		line-height: 40px;
		display: flex;
	}
	.land-selection-service{
		height: 200px;
		width: 100%;
		margin-top: 8px;
		border: 1px solid red;
		background-color: white;
	}
	.land-selection-service-top{
		display: flex;
		height: 20px;
	}
	.land-selection-service-privilege{
		margin-left:auto; font-size: 12px;line-height:20px
	}
	.land-dateBase{
		height: 200px;
		width: 100%;
		margin-top: 8px;
		border: 1px solid red;
		background-color: white;
	}
	.land-seedList{
		height: 200px;
		width: 100%;
		margin-top: 8px;
		border: 1px solid red;
		background-color: white;
	}
	.land-History{
		height: 200px;
		width: 100%;
		margin-top: 8px;
		border: 1px solid red;
		background-color: white;
	}
</style>